{% extends "layout/default.html" %}


{% block main_content %}

	<h3 class="header smaller lighter blue">欢迎使用股票系统</h3>

	<div class="clearfix">
		<div class="pull-right tableTools-container"></div>
	</div>

	<div>
		<div class="pull-right tableTools-container"></div>
		<table id="dynamic-table" class="table table-striped table-bordered table-hover">
			<thead>
				<tr>{% for column_name in stockWeb.column_names %}
					<th>{{ column_name }}</th>
				{% end %}
                    <th>操作1</th>
				</tr>
			</thead>


		</table>
	</div>

<table id="myTable" class="display" style="width:100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Ops Coffee</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>18</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
        </tr>
        <!-- 中间省略一些tr数据 -->
        <tr>
            <td>Donna Snider</td>
            <td>Customer Support</td>
            <td>New York</td>
            <td>27</td>
            <td>2011/01/25</td>
            <td>$112,000</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
        </tr>
    </tfoot>
</table>




    <script type="text/javascript">

    $(function () {

        {#var nameParam = $.getUrlVar('table_name');#}
        //console.log(nameParam);
        $('#dynamic-table').bootstrapTable({
	ajax : function (request) {
        $.ajax({
            type : "GET",
            url : "/stock/api_data?name=livermore_guess_daily",
			contentType: "application/json;charset=utf-8",
			dataType:"json",
			data:'',
			jsonp:'callback',
            success : function (msg) {
                console.log(msg.recordsTotal);
                console.log(msg.data);
                request.success({
                    row: msg.data
                });

                $('#dynamic-table').bootstrapTable('load',msg.data)
            },
			error:function(){
				alert("错误");
			}
        });
	},
		singleSelect:true,
		clickToSelect:true,
		sortName: "date",
		sortOrder: "desc",
		pageSize: 15,
		pageNumber: 1,
		pageList: "[5, 10, 15, 100, All]",
		showToggle: true,
		showRefresh: true,
		showColumns: true,
		search: true,
		pagination: true,
        columns: [
            {field: "date",title: "Date", sortable: true},
            {field: "code"},
            {field: "name"},
            {field: "latest_price"},
            {field: "quote_change"},
            {field: "ups_downs"},
            {field: "turnover_rate"},
            {field: "type" , editable: true},
            {field: "color"},
            {
                field: 'date',
                title: '操作',
                align: 'center',
                valign: 'middle',
                width: '10%',
                visible: true,
                formatter: function (value, row, index) {
                    // var sid_code = base64encode(row.sid + '');   //  sid 加密处理
                    // alert(sid_code);
                    return '<a href="#">' +
                        '<i class=" glyphicon-eye-open" title="显示">显示</i> ' +
                        '</a>'+
                        '<a href="#editProject" data-toggle="modal" title="修改">' +
                        '<i class=" glyphicon-pencil">修改</i> ' +
                        '</a>'+
                        '<a href="javascript:void(0)" title="删除">' +
                        '<i class=" glyphicon-trash text-danger">删除</i> ' +
                        '</a>';
                },
                events: {
                  'click a[title=删除]': function (e, value, row, index) {
                      if(confirm('此操作不可逆，请确认是否删除？')){
                          $.ajax({

                          });
                      }
                  },
                  'click a[title=修改]': function (e, value, row, index) {
                      // e.preventDefault();
                      alert('click change button');
                  },
                }
            }
            ]
        });

    });
	</script>

{% end %}